<template>
	<view class="xiangmuxinxi" :style="{paddingBottom:!xmxxAllow  ? 168 + bottomHight +'rpx'  : isIos?'30rpx' :'80rpx',marginBottom:xmxxAllow ? '200rpx'  : '0'}">
		<view class="product-list" :class="{ hasVisited: showGray(item) }" v-for="(item, index) in xmxxList"
			:key="index" @click="() => toDetail(item)">
			<view class="productTitle ">
				<view class="newsType"
					:class="newsTypeBgMap[item.news_type] ? newsTypeBgMap[item.news_type] : 'redTag'">
					{{ item.news_type_des ? item.news_type_des : '未知' }}
				</view>
				<!-- v-html='item.endTitle' -->
				<view class="title f30 text-ellipsis-2" style="font-weight: bold;" >
					<u-parse :content="item.endTitle" />
				</view>
			</view>
			<template v-if="typeInfo.zhaobiao.includes(item.news_type + '')">
				<view class="xmgk f24 d-f" v-if="item.yezhu && item.yezhu !='-' && !xmxxAllow" >
					招标业主：<text style="filter: blur(5px);">{{item.yezhu.substring(0,8)}}</text>{{item.yezhu.slice(-2)}}<view class="lxfs">联系方式</view>
				</view>
				<view class="xmgk f24 d-f" v-if="item.yezhu && item.yezhu !='-' && xmxxAllow">
					招标业主：<view class="text-ellipsis" v-html="item.yezhu"></view>
				</view>
			</template>
			<!-- <template v-if="typeInfo.zhongbiao.includes(item.news_type + '')">
				<view class="xmgk f24 d-f" v-if='item.yezhu'>
					<text class="text-ellipsis">供应商：{{ item.yezhu}}</text>
				</view>
			</template> -->
			<template v-if="typeInfo.zhongbiao.includes(item.news_type + '')">
				
				<view class="xmgk f24 d-f" v-if="item.news_zhongbiao &&  item.news_zhongbiao !='-' &&  !xmxxAllow">
					供应商：<text style="filter: blur(5px);">{{item.news_zhongbiao.substring(0,8)}}</text>{{item.news_zhongbiao.slice(-2)}}<view class="lxfs">联系方式</view>
				</view>
				<view class="xmgk f24 d-f" v-if="item.news_zhongbiao  &&  item.news_zhongbiao !='-' && xmxxAllow">
					<text class="text-ellipsis">供应商：{{ item.news_zhongbiao}}</text>
				</view>
			</template>

			<view class="leibie d-b-c">
				<view class="flex-1 d-f">
					<view class="label grayBlueTag2 f22 flexs blue" v-if="item.jine !== '--' && item.jine !== '' && item.jine != '0元' && item.jine !=0">
						{{ item.jine }}元
					</view>
					<view class="label grayBlueTag2 f22 gray6Tag">
						{{item.new_Industry}}
					</view>
					<!-- news_bstrue 附件标记 默认0 无附件 1 有标书 2 有附件  （可以解释为>0就有附件） -->
					<view class="label f22 grayBlueTag2" style="display: flex;align-items: center;"
						v-if="item.news_bstrue > 0">
						<!-- 2979ff #777 -->
						<u-icon name="attach" color="#6C717E" labelColor="#6C717E" size="32rpx" labelSize="22rpx"
							:label="item.news_bstrue === 1 ? '标书' : item.news_bstrue === 2 ? '附件' : ''"
							labelPos="right"></u-icon>
					</view>
				</view>
				<view class="shijian d-f">

					<text class="shijian-text f22">
						{{item.news_star_time}}
					</text>
				</view>
			</view>
			<view class="xmgk f24 d-f" style="color: #FF1717;"
				v-if="(item.news_end_time !== null  && item.news_type == 2) || (item.news_end_time !== null  && item.news_type == 2)">
				截至时间：{{item.news_end_time !== null ? item.news_end_time.slice(0,10) : '' }} <text
					style="margin-left:50rpx;">详情请见信息</text>
			</view>
		</view>
		
		<!-- 免费会员或者游客展示 -->
		<view class="mianfeizhanshi" v-if="!xmxxAllow && xmxxList.length">
			<view class="txt">
				免费用户可查看一周前的部分状态
			</view>
			<view class="txt">
				您可<text>开通会员</text>实时查看更多完整数据
			</view>
			<view class="btn">
				<button @click="lijikaitong">
					立即开通
				</button>
				<!-- <button @click="rengongkaitong">
					人工开通
				</button> -->
			</view>
		</view>
		<!-- listloading组件   style="margin-bottom:200rpx;"  :style="{marginBottom:!xmxxAllow && xmxxList.length ?'30rpx' :'200rpx'}"-->
		<list-loading :status.sync="status" :isBottom.sync="xmxxIsbottom"
			:defindNull="!xmxxList.length" :listdata="xmxxList" :style="{marginBottom:!xmxxAllow && xmxxList.length ?'0' :'200rpx'}">
			<view class="nullWrap" v-if="xmxxAllow && !xmxxList.length">
				<image src="https://img.bidcenter.com.cn/uni/zanwushuju.png" mode="aspectFit" >
				</image>
			</view>
			<view class="mianfeizhanshi" style="margin-top: 0;" v-if="!xmxxAllow && !xmxxList.length">
				<view class="txt">
					免费用户可查看一周前的部分状态
				</view>
				<view class="txt">
					您可<text>开通会员</text>实时查看更多完整数据
				</view>
				<view class="btn">
					<button @click="lijikaitong">
						立即开通
					</button>
					
				</view>
			</view>
			
		</list-loading>
	</view>
</template>

<script>
	import commonjs from '@/common/script/common.js';
	import listLoading from '@/components/list-loading/list-loading.vue'
	import {
		keyslist
	} from '@/util/index.js'
	import {
		clickedObj
	} from '@/util/index.js';
	export default {
		name: "Xiangmuxinxi",
		props: ['xmxxForm',"xmxxIsbottom","isUpdateXmxx","bottomHight","xmxxAllow","isClickSearch","xmxxLength","xmxxStatus"],
		components: {
			listLoading,
		},
		data() {
			return {
				location:10903,
				commonjs,
				clickedObj,
				clickid: '',
				initForm: JSON.parse(JSON.stringify(this.$props.xmxxForm)),
				// 项目信息列表
				status: 'loading',
				page: 1,
				pageSize: 40,
				nomoreText: '已全部加载完毕',
				xmxxList: [],
				userInfo:uni.getStorageSync('userInfo') || {},
				typeInfo: {
					'zhaobiao': ['1', '2', '5', '6', '7', '9', '17', '32'],
					'zhongbiao': ['4'],
					//'xiangmu': ['3', '10', '12', '13', '14', '15', '16', '90', '97', '98', '99'],
					// 20240108调整
					'xiangmu': ["3", "13", "10",  "12", "99", "90"],
					/**
					 * 20220602 和窦窦确认，进行项目类型的合并显示，目前仅用于 工程项目订阅列表页中的 类型显示 (即全部一栏)
					 * '3，13', '10', '12，99',  '90',
					 */
					'xiangmu2': ['3', '10', '12', '90'],
					// 结构化数据包服务，信息类型
					'shujubao': ['1', '4']
				},
				isIos:false,
				nexttoken:'',
			}
		},
	
		async mounted() {
			this.$nextTick(() => {
				if(this.isUpdateXmxx){
					this.getList()
				}
			})
			const systemInfo = uni.getSystemInfoSync();
			this.isIos = systemInfo.platform.toLowerCase() === 'ios';
		},

		computed: {
			showGray() {
				return item=> {
					let data = false;
					const id = item.njid ? item.njid : item.news_id
					if (item.njid) {
						data = this.clickedObj.pro.get() && this.clickedObj.pro.get().includes(item.njid);
					} else {
						data = this.clickedObj.bx.get() && this.clickedObj.bx.get().includes(item.news_id);
					}
					return data || this.clickid === item.id;
				}
			},
			ininData: function() {
				const ininData = JSON.parse(JSON.stringify(this.$store.state.init));
				for (let i in ininData) {
					ininData[i].map(item => {
						item.text = item.value;
						item.value = item.key;
						delete item.key;
					});
					if (i === 'newsTypeData') {
						let types,
							typsArr = [];
						// 免费会员
						if (this.userInfo.hyJibie == '免费会员') {
							types = [1, 27, 4, 2, 6, 8, 18, 17, 12, 11, 15, 13, 0];
						} else {
							types = [1, 27, 4, 2, 6, 8, 18, 17, 12, 11, 15, 13];
						}
						let xinxileixing = []
						types.map(m => {
							ininData[i].map(x => {
								if (+x.value === m) {
									// 独家项目 更新为 VIP独家
									if (m === 12) {
										x.text = 'VIP独家';
									}
									typsArr.push(x);
								}
							});
						});
						typsArr.unshift({
							text: '全部类型',
							value: ''
						});
						ininData[i] = typsArr;
						typsArr.map(i => {
							xinxileixing.push({
								value: i.text,
								key: i.value
							})
						})
						this.inforList = xinxileixing
					}
				}
				return ininData;
			},
			newsTypeBgMap: function() {
				const obj = {}
				const ininData = this.xmxxList
				ininData.map(item => {
					/**
					 * 审批公示 17 orange1Tag
					 */
					if (item.news_type == '4') {
						obj[item.news_type] = 'redTag'
					} else if (item.news_type == '17') {
						obj[item.news_type] = 'orange1Tag'
					} else if (item.news_type == '13') {
						// 拟在建项目
						obj[item.news_type] = 'blue2Tag'
					} else if (item.news_type == '12') {
						// vip独家
						obj[item.news_type] = 'orange2Tag'
					} else if (item.news_type == '2') {
						// 招标预告
						obj[item.news_type] = 'purpleTag';
					} else if (item.news_type == '6') {
						// 招标变更
						obj[item.news_type] = 'pinkTag';
					} else if (item.news_type == '3') {
						// 拟建项目
						obj[item.news_type] = 'blue2Tag';
					} else if (item.news_type == '10') {
						// 项目审批
						obj[item.news_type] = 'orangeTag';
					} else {
						// 招标类型 参考信息90
						obj[item.news_type] = 'blueTag'
					}
				})
				return obj
			},
			
		

		},
		watch: {
			xmxxForm: {
				handler(a, b) {
					if (a !== b && b != undefined) {
						this.initForm = a
						
						//如果企业信息接口报错，company没有内容
						if(a.company==''){
							this.status = 'nomore'
							this.nomoreText = loadmore ? '已全部加载完毕' : '暂无数据'
							this.$emit('update:xmxxIsbottom',false)
						}
						// console.log(111,a,b)   
						//this.isUpdateXmxx ||
						if ( a.time !== b.time || a.diqu !== b.diqu || (a.danweiType !== b.danweiType && b.danweiType !=='') || a.keywords2 !== b.keywords2 || a.xiangmuType !== b.xiangmuType || this.isUpdateXmxx) {
							this.getList()
						}
						
					}
				
				},
				immediate: true
			},
			// isClickSearch: {
			// 	handler(a, b) {
			// 		if (a !== b && a) {
			// 			this.getList()
			// 		}
				
			// 	},
			// 	immediate: true
			// },
			xmxxIsbottom: {
				handler(a, b) {
					if (a !== b && a) {
						if(!this.xmxxList.length){
							this.$emit('update:xmxxIsbottom',false)
							return
						}
						if (this.xmxxList.length < 10) {
							return
						}
						if (this.status !== 'nomore') {
								this.getList({
										page: ++this.page
									},
									true
								);
						}
						
					}
				},
				immediate: true
			},
			
		},
		methods: {
			//获取项目信息
			getList(params = {}, loadmore) {
				// 非下拉加载时
				if (!loadmore) {
					this.status = 'loading';
					this.nomoreText = "努力加载中..."
					this.xmxxList = [];
					this.nexttoken=''
				}
				/**
				 * 20250409by帅帅  wechat/GetSearchListHandler.ashx
				 * 作为业主、供应商、代理单位时，传对应zhaobiao\zhongbiao\daili字段，输入框的值传到keywords2
				 * 作为提及单位时，keywords传 单位名称+输入框的值
				*/
			   /**
			    * 20250427by张珈铭要求与用户中心接口额一致  
				* 业主、代理 analysis/Company/partA/BidXiangMuListHandler.ashx
				* 供应商  analysis/Company/partB/WinningXiangMuListHandler.ashx
			   */
			   // console.log('jiekou',this.initForm.xiangmuType,this.initForm.comcode,this.initForm.vcode)
				let paramsNew ={}
				//业主、代理用同一个接口
				if(this.initForm.danweiType=='2' || this.initForm.danweiType=='1'){
					// 0 查业主 '1'查代理
					let isdaili = this.initForm.danweiType=='2' ? 0 : 1
					let  isxgxm = this.initForm.danweiType=='2' ? this.initForm.xiangmuType : 0
					paramsNew = Object.assign({}, {
							comcode:this.initForm.comcode,
							vcode:this.initForm.vcode,
							keyword:this.initForm.keywords2,
							pageindex: this.page,
							pagesize: this.pageSize,
							xmsort:1,
							nexttoken:this.nexttoken,
							time: this.initForm.time, //3:近三天；7：近一周；30：近一月；90：近三月；180：近半年；11：近一年
							areacode: this.initForm.areacode,
							starttime: this.initForm.stime,
							endtime: this.initForm.endtime,
							isxgxm:isxgxm,
							isdaili:isdaili, // 0 查业主 '1'查代理
						},
						params
					);
					// console.log(paramsNew)
					uni.$u.http
						.post('/analysis/Company/partA/BidXiangMuListHandler.ashx', paramsNew)
						.then(rs => {
							const dt = rs.list || [];
							this.$emit('update:xmxxLength',rs.totalcount)
							this.nexttoken=rs.nexttoken
							
							if (!dt.length) {
								this.status = 'nomore'
								this.nomoreText = loadmore ? '已全部加载完毕' : '暂无数据'
								this.$emit('update:xmxxIsbottom',false)
							} else {
								if (dt.length < this.pageSize) {
									this.status = 'nomore'
									this.nomoreText = '已全部加载完毕'
								} else {
									
									this.status = 'loading'
									this.$emit('update:xmxxIsbottom',false)
								}
							}
							this.$emit('update:xmxxStatus',false)
							// const {
							// 	keywords2
							// } = paramsNew;
							// console.log(this.initForm.keywords2)
							// 关键词标红
							const keysArr = keyslist(this.initForm.keywords2);
					
							const data = keysArr.join('|')
					// console.log(data)
							dt.map(item => {
								item.endTitle = item.news_title;
					
								if (data.length) {
									const reg = new RegExp(`(${data})`, "g");
									item.endTitle = item.endTitle && item.endTitle.replace(reg,
										'<text style="color:#F24949;">$1</text>');
								}
								this.xmxxList.push(item);
							})
							if (paramsNew.page === 26 && (this.userInfo.hyJibie == '免费会员' || this.userInfo.hyJibie ==
								'游客')) {
								// this.showPopupMember = true
								this.status = 'nomore'
								this.nomoreText = '开通会员享受完整功能,多种类型会员等你选择'
								this.$emit('update:xmxxStatus',false)
								return
							}
							//如果没权限，则展示前三条
							if (!this.xmxxAllow){
								this.xmxxList=this.xmxxList.slice(0,3)
							}
						}).catch(err => {
							console.log(err)
							uni.$u.toast(err.msg || '监控接口异常');
						});
				}else if(this.initForm.danweiType=='5'){
					 paramsNew = Object.assign({}, {
							comcode:this.initForm.comcode,
							vcode:this.initForm.vcode,
							keyword:this.initForm.keywords2,
							pageindex: this.page,
							pagesize: this.pageSize,
							xmsort:1,
							nexttoken:this.nexttoken,
							time: this.initForm.time, //3:近三天；7：近一周；30：近一月；90：近三月；180：近半年；11：近一年
							areacode: this.initForm.areacode,
							starttime: this.initForm.stime,
							endtime: this.initForm.endtime,
							isxgxm:this.initForm.xiangmuType,
							
						},
						params
					);
					uni.$u.http
						.post('/analysis/Company/partB/WinningXiangMuListHandler.ashx', paramsNew)
						.then(rs => {
							const dt = rs.list || [];
							this.$emit('update:xmxxLength',rs.totalcount)
							this.nexttoken=rs.nexttoken
							if (!dt.length) {
								this.status = 'nomore'
								this.nomoreText = loadmore ? '已全部加载完毕' : '暂无数据'
								this.$emit('update:xmxxIsbottom',false)
							} else {
								if (dt.length < this.pageSize) {
									this.status = 'nomore'
									this.nomoreText = '已全部加载完毕'
								} else {
									
									this.status = 'loading'
									this.$emit('update:xmxxIsbottom',false)
								}
							}
							this.$emit('update:xmxxStatus',false)
							// const {
							// 	keywords2
							// } = paramsNew;
							// 关键词标红
							const keysArr = keyslist(this.initForm.keywords2);
					
							const data = keysArr.join('|')
					
							dt.map(item => {
								item.endTitle = item.news_title;
					
								// const newarea = item.news_areastr || '';
								// const areaval = newarea.length <= 3 ? newarea : newarea.substr(0, 3) + '...';
								// item.news_areastr = areaval;
					
								if (data.length) {
									const reg = new RegExp(`(${data})`, "g");
									item.endTitle = item.endTitle && item.endTitle.replace(reg,
										'<text style="color:#F24949;">$1</text>');
								}
								this.xmxxList.push(item);
							})
							if (paramsNew.page === 26 && (this.userInfo.hyJibie == '免费会员' || this.userInfo.hyJibie ==
								'游客')) {
								// this.showPopupMember = true
								this.status = 'nomore'
								this.nomoreText = '开通会员享受完整功能,多种类型会员等你选择'
								this.$emit('update:xmxxStatus',false)
								return
							}
							//如果没权限，则展示前三条
							if (!this.xmxxAllow){
								this.xmxxList=this.xmxxList.slice(0,3)
							}
							
							
						}).catch(err => {
							console.log(err)
							uni.$u.toast(err.msg || '监控接口异常');
						});
				}
			},
			//项目信息点击进详情
			toDetail(item) {
				const id=item.njid > 0 ? item.njid : item.news_id
				item.id= id
				this.clickid = id;
				let uri = encodeURIComponent(JSON.stringify(item));
				
				const xmDetailType = [3, 10, 12, 13, 90, 97, 98, 99];
				let url = '';
				if (xmDetailType.includes(item.news_type)) {
					clickedObj.pro.set(id);
					url='/pages/xiangmu/detail?ly=search=' + encodeURIComponent(uri);
				
				} else {
					clickedObj.bx.set(id);
					url='/pages/zhaobiao/detail?ly=search&data=' + encodeURIComponent(uri)
					
				}
				uni.navigateTo({
					url:url
				})
			
			},
			lijikaitong(){
				// 免费会员需要跳转会员中心并勾选-企业分析-自动勾选
				// 移动会员跳转到功能购买查人脉支付页面
				if(this.userInfo.hyJibie == '免费会员' || this.userInfo.hyJibie == '游客'){
					uni.navigateTo({
						url:'/pages/user/huiyuan/payment?tuoke=1',
					})
				}
				if(this.userInfo.hyJibie.includes('移动')){
					uni.navigateTo({
						url:'/pages/qiqing/pay/pay',
					})
				}
				
			},
			rengongkaitong(){
				uni.$u.http
					.post('/wxapp/WxAppFuFeiSendMsgHandler.ashx', {
						location: this.location,
						ctid:'9348', // 9344为续费申请 9347为会员升级 9348为会员开通
					}).then(rs => {
						uni.navigateTo({
							url:'/pagesOne/kefujingli/addkefu'
						})
					}).catch(err => {
						uni.$u.toast(err.msg);
					})
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/css/index.scss';
	@import '@/static/css/list.scss';
	@import '@/static/css/qiqing.scss';

	.xiangmuxinxi {
		// margin-top: 20rpx;
		margin-bottom: 200rpx;
	}

	.nullWrap {
		padding: 60rpx 0 0rpx;
		text-align: center;
	}
	.mianfeizhanshi{
		text-align: center;
		margin-top: -74rpx;
		
		background: linear-gradient(-180deg,rgba(255,255,255,0.6) 0%,#fff 100%);
		z-index: 2;
		position: relative;
		padding: 90rpx 0 120rpx;
		.txt{
			margin-bottom: 16rpx;
			font-size: 24rpx;
			color: #333333;
			text{
				color: #FE6B2F;
			}
		}
	}
	.btn{
		width: 600rpx;
		margin: 0 auto;
		margin-top:32rpx;
		display: flex;
		button{
			display: inline-block;
			flex:1;
			height: 88rpx;
			line-height: 88rpx;
			font-size: 32rpx;
			font-weight: bold;
			border-radius: 4rpx;
			border: 0;
			&::after{
				border: none;
			}
			&:first-child{
				margin-right: 40rpx;
				color: #fff;
				background: linear-gradient( 90deg, #1F91FF 0%, #1D11FB 100%);
			}
			// &:last-child{
			// 	color: #82410E;
			// 	background: linear-gradient( 90deg, #FCE37E 0%, #FBA767 100%);
			// }
		}
	}
	.weikaitong{
		padding-top: 76rpx;
		margin-bottom: 200rpx;
		text-align: center;
		image{
			width: 400rpx;
			height: 310rpx;
		}
		.title{
			font-size: 28rpx;
			color: #3B3E45;
			font-weight: bold;
		}
		.desc{
			margin-top: 20rpx;
			font-size: 24rpx;
			color: #6C717E;
		}
		
	}
	
	
</style>